import React,{Component, useContext} from 'react'
import { TodolistContext } from './context';


class List extends Component{
    static contextType=TodolistContext;
    render() {
        console.log(this)
        console.log(this.context);
        return (
            <ul>
                {
                    this.context.list.map((item, index) => <li key={index}>{item}</li>)
                }
            </ul>
        )
    }
}

export default List;


// export const List = () => {
//     // const state=useContext(TodolistContext);
//     const {list}=useContext(TodolistContext);
//     // console.log(state);
//     return (
//         <div>
//             <ul>
//                 {
//                     list.map((item, index) => <li key={index}>{item}</li>)
//                 }

//                 {/* <TodolistContext.Consumer>
//                     {/* consumer里面放的函数 */}
//                     {/* {
//                         (state)=>{
//                             // console.log(state)
//                             return state.list.map((item, index) => <li key={index}>{item}</li>)
//                         }
//                     } */}
//                 {/* </TodolistContext.Consumer> */} 
//             </ul>
//         </div>
//     )
// }
